/* 左右结构CSS */
.about-content {
    display: flex;
    flex: 1;
    overflow: hidden;


    .about-content-left {
        flex: 1;
        display: flex;
        flex-direction: column;
        background-color: #ffffff;
        padding: .625rem;
        margin-right: .9375rem;
        flex-shrink: 0;
        overflow: hidden;
    }

    .about-content-right {
        flex: 7;
        background-color: #ffffff;
        padding: .625rem;
        flex-shrink: 0;
        overflow: hidden;

    }

    /* 无Tab栏上下结构 */
    .up-down-right {
        flex: 7;
        background-color: #f0f2f5;
        flex-shrink: 0;
        overflow: hidden;

        .up-down-section {
            height: 100%;
            display: flex;
            flex-direction: column;


            .up-down-head {
                display: flex;
                justify-content: space-between;
                align-items: center;
                background-color: #ffffff;
                margin-bottom: .625rem;
                padding: .625rem;
            }


            .up-down-content-article {
                flex: 1;
                background-color: #ffffff;
                padding: .625rem;
                flex-shrink: 0;
                overflow: hidden;


            }
        }
    }

    /* 左侧列表 */
    .about-content-left {
        header {
            display: flex;
            align-items: center;
            padding-bottom: 0.625rem;
            margin-bottom: 0.625rem;
            border-bottom: 2px solid #f0f2f5;

            .search {
                flex: 1;
            }

            .icon {
                margin-left: .9375rem;
                font-size: 1.25rem;
                cursor: pointer;
            }
        }

        section {
            flex: 1;

            overflow-y: auto;

            .section-box {
                display: flex;
                padding: 0.7375rem 0.325rem;
                align-items: flex-start;

                cursor: pointer;

                .section-box-tip {
                    flex: 2;
                }

                .section-box-info {
                    flex: 10;
                }
            }

            .section-active {
                background-color: #e1edea;
            }
        }
    }
}

/* 右侧上下布局css */
.content-offside {
    display: flex;
    flex-direction: column;
    height: 100%;

    .offside-header {
        margin-bottom: .625rem;
    }

    .offside-section {
        display: flex;
        flex-direction: column;
        flex: 1;

        .head {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .content-article {
            flex: 1;

            .table-content {
                height: 100%;
            }
        }
    }
}




/* 对齐flex布局 */
.flex-alignment {
    display: flex;
    align-items: center;
}

/* 左右居中flex布局 */
.flex-about {
    display: flex;
    justify-content: space-between;
}
/* 上下flex布局 */
.flex-up-down{
    display: flex;
    flex-direction: column;
}

/* 通用按钮间隔 */
.offside-button-right {
    margin-right: 1rem;
}

.offside-button-content {
    margin: 0 1rem;
}

/* 通用下间隔 15px */
.offside-bottom {
    margin-bottom: .9375rem;
}